<template>
  <el-dialog width="40%" :visible.sync="dialogVisible" center ref="dialogRef" class="details-dialog" append-to-body
    title="报告详情">
    <div v-if="assayData.length>0">
      <el-collapse accordion @change="handleChange">
        <div v-for="(item) in assayData" :key="item.id">
          <el-collapse-item :title="'('+item.PatName+')'+item.RptOrderNameList" :name="item.WorksheetId">
            <el-table v-loading="loading" border stripe :data="rePortDetailArr" max-height="400px">
              <el-table-column align="center" prop="ItemNameCn" label="检查项目">
              </el-table-column>
              <el-table-column align="center" prop="ValueMain" label="检查结果">
                <template slot-scope="scope">
                  <!--   {{ scope.row.ValueMain+scope.row.isElevated>0?``<i class="el-icon-top"></i>:'' }} -->
                  <div v-if="scope.row.ValueMain>scope.row.isElevated">
                    {{scope.row.ValueMain}}<i class="el-icon-top" style="color:red;font-weight: bold;"></i>
                  </div>
                  <div v-if="scope.row.ValueMain<scope.row.firstIsElevated">
                    {{scope.row.ValueMain}}<i class="el-icon-bottom" style="color:red;font-weight: bold;"></i>
                  </div>
                  <div v-if="scope.row.str">
                    {{scope.row.ValueMain}}
                  </div>

                  <div v-if="scope.row.ValueMain<scope.row.isElevated && scope.row.ValueMain>scope.row.firstIsElevated">
                    {{scope.row.ValueMain}}
                  </div>
                  <!--  <div v-if="scope.row.ValueMain>scope.row.firstIsElevated&&cope.row.ValueMain<scope.row.isElevated">
                    {{scope.row.ValueMain}}
                  </div> -->

                </template>
              </el-table-column>

              <!--      <el-table-column align="center" prop="isElevated" label="检查结果">
              </el-table-column>
              <el-table-column align="center" prop="firstIsElevated" label="检查结果">
              </el-table-column> -->

              <el-table-column align="center" prop="address" label="参考结果">
                <template slot-scope="scope">
                  {{scope.row.ReferenceValue+scope.row.ReferenceUnit}}
                </template>
              </el-table-column>
            </el-table>
          </el-collapse-item>
        </div>
      </el-collapse>
    </div>
    <div v-if="ImageData.length>0">

      <el-collapse accordion @change="handleChangeImage">
        <div v-for="(item) in ImageData" :key="item.id">
          <el-collapse-item :title="'('+item.PatName+')'+item.RptOrderNameList" :name="item.id">
            <el-table v-loading="loading" border stripe :data="ImageRePortDetailArr" max-height="400px">
              <el-table-column align="center" prop="ImageDiag" label="影像诊断">
              </el-table-column>
              <el-table-column align="center" prop="ImageView" label="影像所见">
              </el-table-column>
            </el-table>
          </el-collapse-item>
        </div>
      </el-collapse>

    </div>
    <div v-if="assayData.length==0&&ImageData.length==0">
      <div style="text-align: center;">数据正在加载中.....</div>
    </div>
  </el-dialog>
</template>

<script>
import { ApiAdminImageReportList, ApiAdminReportList, ApiAdminExamineReportDetail } from "@/api/index";
export default {
  data() {
    return {
      dialogVisible: false,
      assayData: [],
      rePortDetailArr: [],
      ImageRePortDetailArr: [],
      ImageData: [],
      loading: false,
      data: [{ name: '1', age: '2' }]
    }
  },
  methods: {
    show(e) {
      if (e.item.report_type == '化验报告') {
        this.ImageData = []
        ApiAdminReportList({ order_id: e.id }).then(res => {
          this.assayData = res.data
        })
      } else {
        this.assayData = []
        ApiAdminImageReportList({ order_id: e.id }).then(res => {
          this.ImageData = res.data
        })
      }
      this.dialogVisible = true
    },
    /*   影响报告切换 */
    handleChangeImage(e) {
      const data = this.ImageData.find(item => {
        if (item.id == e) {
          return item
        }
      })
      if (data) {
        this.ImageRePortDetailArr = []
        this.ImageRePortDetailArr.push(data)
      }
    },
    //切换化验报告
    handleChange(e) {
      this.loading = true
      if (e) {
        this.loading = true
        ApiAdminExamineReportDetail({ worksheetId: e }).then(res => {
          this.rePortDetailArr = []
          res.data.forEach(item => {
            if (item.ItemNameCn) {
              if (item.ReferenceValue.indexOf('-') != '-1') {
                item.isElevated = Number(item.ReferenceValue.substring(item.ReferenceValue.lastIndexOf('-') + 1))
                // 通过切片获取第一个'-'后的值
                item.firstIsElevated = Number(item.ReferenceValue.substring(0, item.ReferenceValue.indexOf('-')))
              } else {
                if (item.ReferenceValue.indexOf('≥') != '-1') {
                  item.firstIsElevated = item.ReferenceValue.match(/[\d.]+/)[0]
                  item.isElevated = '99999'
                } else if (item.ReferenceValue.indexOf('≤') != '-1') {
                  item.isElevated = item.ReferenceValue.match(/[\d.]+/)[0]
                  item.firstIsElevated = 0
                } else {
                  item.str = true
                }
              }
              this.rePortDetailArr.push(item)
            }
          });
          this.loading = false
        }).finally(() => {
          this.loading = false
        })
      }

    }
  }
}
</script>

<style>
</style>